
import 'package:flutter/material.dart';
import 'package:xim/common/style/colors.dart';
import 'package:xim/widget/common/state.dart';
import 'package:xim/widget/common/ui/cell.dart';

/// 监控页面
class ControlPage extends StatelessWidget with AppBarMixin, BrightnessMode{

  ControlPage({Key? key}) : super(key: key);

  ModelColor bgColor = ModelColor(lightColor: const Color(0xff101010), darkColor: const Color(0xff101010));
  ModelColor fgColor = ModelColor(lightColor: const Color(0xfffefefe), darkColor: const Color(0xff191919));
  ModelColor textColor = ModelColor(lightColor: const Color((0xff181818)), darkColor: const Color(0xffd1d1d1));
  ModelColor weakTextColor = ModelColor(lightColor: const Color(0xff737373), darkColor: const Color(0xff888888));

  @override
  String get appBarTitle => "监控";

  @override
  TextStyle get appBarTitleStyle => TextStyle(color: textColor.color, fontSize: 16);

  @override
  IconThemeData get iconTheme => IconThemeData(color:textColor.color);

  @override
  List<ModelColor> get brightnessColors => [bgColor, fgColor, textColor,weakTextColor];

  @override
  Color get appBarBgColor => bgColor.color;

  Widget get arrow => Cell.iconItem(
      iconData: Icons.chevron_right,
      iconStyle: IconStyle(size: 20, color: weakTextColor.color)
  );

  @override
  Widget build(BuildContext context) {
    initModelColor(context);
    return Scaffold(
      backgroundColor: bgColor.color,
      appBar: appBar,
      body: Column(
        children: <Widget>[
          Cell.titleCell(
            decoration: BoxDecoration(
              color: fgColor.color
            ),
            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
            title: "网络监控",
            titleStyle: TextStyle(color: textColor.color),
            rightItem: rightItem(null),
          ),
          const SizedBox(height: 6,),
          Cell.titleCell(
            decoration: BoxDecoration(
                color: fgColor.color
            ),
            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
            title: "API",
            titleStyle: TextStyle(color: textColor.color),
            rightItem: rightItem(null),
          ),
          const SizedBox(height: 6,),
          Cell.titleCell(
            decoration: BoxDecoration(
                color: fgColor.color
            ),
            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 12),
            title: "监控管理",
            titleStyle: TextStyle(color: textColor.color),
            rightItem: rightItem(null),
          )

        ],
      ),
    );
  }

  Widget rightItem(String? text, {bool isShowArrow=true}){
    return Row(
      children: [
        if(text!=null) Text(text, style: TextStyle(color: weakTextColor.color, fontSize: 14),),
        const SizedBox(width: 6,),
        if(isShowArrow) arrow,
      ],
    );
  }
}
